<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>微博首页</h1>
<div>
    <div v-if="isLogin"> <!-- 如果登录后,显示此内容 -->
        <p>欢迎{{user.nickname}}回来!</p>
        <a href="insert.html">发布微博</a>
        <a href="javascript:void(0)" @click="logout()">登出</a>
    </div>
    <div v-else> <!-- 如果未登录,显示此内容 -->
        <a href="reg.html">注册</a>
        <a href="login.html">登录</a>
    </div>
    <hr>
    <div v-for="weibo in arr">
        <h3>{{weibo.nickname}}说:{{weibo.content}}</h3>
        <img :src="weibo.url" width="100">
    </div>
</div>

    <script src="js/vue.js"></script>
    <script src="js/axios.min.js"></script>
    <script>
        let v = new Vue({
            el:"body>div",
            data:{
                isLogin:false,
                user:{nickname:"TH"},
                arr:[]
            },
            created:function (){
                //发送请求获取当前登录的用户信息
                axios.get("currentUser").then(function (response) {
                    v.user = response.data;
                    v.isLogin = v.user == "" ? false : true;
                }),
                axios.get("select").then(function (response) {
                    v.arr = response.data;
                })
            },
            methods:{
                logout(){
                    axios.get("logout").then(function (response){
                        location.reload(); //刷新页面
                    })
                }
            }
        })
    </script>
</body>
</html>